<script lang="ts" setup>
import { ref, reactive, provide, nextTick, inject } from 'vue'
import z_paging_item from './components/z-paging-item.vue'
import codePopup from './components/popup.vue'
import {
  useMemberStore,
  useOrderStore,
  useDeviceStore,
  usePagesMachineIdStore,
  useLocationStore,
} from '@/stores'
import { onLoad, onShow } from '@dcloudio/uni-app'
const { loginPromise } = <{ loginPromise: Promise<unknown> }>inject('globalData')

const navTabList = [
  {
    title: '全部订单',
    id: 0,
    status: '',
  },
  {
    title: '待取餐',
    id: 1,
    status: 'AwaitPackage',
  },
  {
    title: '待支付',
    id: 2,
    status: 'ToBePaid',
  },
  {
    title: '已完成',
    id: 3,
    status: 'Finish',
  },
  {
    title: '已取消',
    id: 4,
    status: 'Canceled',
  },
]
const orderStore = useOrderStore()
const locationStore = useLocationStore()

let activeIndex = ref(0)
const bjsPopupRef = ref()
const codePopupRef = ref()
const qrcodeUrl = ref('')
const z_paging_itemRef = ref()
function swiperChangeFn(e: any) {
  activeIndex.value = e.detail.current
  const status = navTabList.find((item) => {
    if (item.id === e.detail.current) {
      return item
    }
  })?.status
  orderStore.setOrderStatus(status!)
}
/**深传值 */
const deepParams = reactive({
  codeOpen: (e: string) => {
    qrcodeUrl.value = e
    codePopupRef.value.open()
  },
})
provide('deepParams', deepParams)
/**弹窗关闭后刷新订单列表 */
const refreshItem = () => {
  let index = navTabList.findIndex((item) => item.status === orderStore.orderStatus)
  z_paging_itemRef.value[index].getList()
}
const memberStore = useMemberStore()

onShow(async () => {
  if (!memberStore.token) return
  let index = navTabList.findIndex((item) => item.status === orderStore.orderStatus)
  await nextTick(() => {})
  loginPromise.then(() => {
    z_paging_itemRef.value[index].getList()
  })
})
const deviceStore = useDeviceStore()

// 调用小程序的分享，以及监听小程序分享
import useMiniShare from '@/hooks/useMiniShare'
const { isShareFriends, setupOnShareAppMessage, onShareAppMessage } = useMiniShare()

isShareFriends()
onShareAppMessage
onShow(() => {
  const shareParams = {
    path: `/pages/goods/goods?machineId=${deviceStore.deviceInfo?.machineId}&machineName=${deviceStore.deviceInfo?.machineName}&positionAddr=${deviceStore.deviceInfo?.positionAddr}&businessStatus=${deviceStore.deviceInfo?.businessStatus}&saleBeginTime=${deviceStore.deviceInfo?.saleBeginTime}&saleEndTime=${deviceStore.deviceInfo?.saleEndTime}`,
    title: deviceStore.deviceInfo?.machineName,
  }
  setupOnShareAppMessage(shareParams)
  console.log(shareParams)
})

const pagesMachineId = usePagesMachineIdStore()

/** 获取设备列表信息 */
const getspotList = async () => {
  try {
    const res = await getMachineDataApi({
      machineId: pagesMachineId.pagesMachineId || null,
      clientId: memberStore.userInfo?.id || '',
      longitude: locationStore.location!.longitude,
      latitude: locationStore.location!.latitude,
      pageNum: 1,
      pageSize: 3,
    })
    let machineItem = res.data?.find((i: any) => pagesMachineId.pagesMachineId === i.machineId)
    machineItem ? deviceStore.setDeviceInfo(machineItem) : null
  } catch (error) {
    console.log('catch', error)
  }
}
onLoad(async (ev) => {
  console.log('onLoad', ev)
  ev?.machineId ? pagesMachineId.setPagesMachineId(ev.machineId) : null
  if (ev && ev.machineId) {
    await nextTick()
    loginPromise.then(() => {
      getspotList()
    })
  }
})
// 公共弹出框
import usePopup from '@/hooks/usePopup'
import { getMachineDataApi } from '@/services/home'
const { SkipPopupRef, receive, skipPopupData } = usePopup()
</script>

<template>
  <z-paging-swiper>
    <template #top>
      <view class="navTab">
        <view
          class="item"
          @tap="activeIndex = index"
          :class="{ active: activeIndex === index }"
          v-for="(item, index) in navTabList"
          :key="item.id"
          >{{ item.title }}</view
        >
      </view>
    </template>
    <swiper @change="swiperChangeFn" :current="activeIndex">
      <swiper-item v-for="(item, index) in navTabList" :key="item.id">
        <z_paging_item
          @openLogin="bjsPopupRef.open()"
          :tabIndex="index"
          :currentIndex="activeIndex"
          ref="z_paging_itemRef"
        />
      </swiper-item>
    </swiper>
  </z-paging-swiper>
  <BjsPopup ref="bjsPopupRef" />
  <codePopup ref="codePopupRef" @refresh="refreshItem" :qrcodeUrl="qrcodeUrl" />
  <BjsSkipPopup :img="skipPopupData.img" ref="SkipPopupRef" @receive="receive" />
</template>

<style lang="scss">
.navTab {
  display: flex;
  justify-content: space-evenly;
  width: 100%;
  height: 96rpx;
  padding-top: 36rpx;
  font-size: 28rpx;
  background-color: #fff;
  box-sizing: border-box;
  z-index: 9;
  .item {
    padding-bottom: 16rpx;
  }
  .active {
    color: #000;
    font-weight: bold;
    border-bottom: 6rpx solid $uni-color-motif;
  }
}
</style>
